import React, { Component } from 'react';
import '../../styles/RankingLabel.scss';
import produce from 'immer';
import { pxToRem, pxToPx,pxToVh } from '../../utils/adaptive.js';
class CustomerTable extends Component {
    constructor(props) {
        super(props);
    }
    componentDidMount() {
    }
    render() {
        const arr = [
            0, 1, 2
        ]
        const { style, type, data } = this.props;
        let formatData = (source = []) => {
            let obj = {};
            source.forEach(item => {
                if (!item instanceof Object) return;
                if (item.text === "all") return;
                obj[item.text] = {
                    ...obj[item.text],
                    ...item
                };
            });
            return Object.values(obj);
        };
        let tableData = [];
        if (data && data.length > 0) {
            tableData = formatData(data);
        }

        return (
            <div className='ranking-label customer-table' style={style}>
                <span className='title-bg'>
                    <i className={`icon iconfont icon-dapingicon_${type}`}></i>
                </span>
                <table>
                    <colgroup>
                        <col width={pxToRem(91)}></col>
                        <col width={pxToRem(93)}></col>
                        <col width={pxToRem(91)}></col>
                    </colgroup>
                    <thead>
                        <tr>
                            <th>
                                {type == "zhengfu" ? "政府" : "医院"}
                            </th>
                            <th>
                                数量
                            </th>
                            <th>
                                占比
                            </th>
                        </tr>
                    </thead>
                    <tbody>
                        {
                            tableData.map((item, i) => {
                                const keys = Object.keys(item);
                                let num = 0, percent = 0;
                                for (let key of keys) {
                                    if (key.includes("client")) {
                                        num = item[key];
                                    }
                                    if (key.includes("percent")) {
                                        percent = item[key];
                                    }
                                }
                                return (<tr key={i}>
                                    <td>{item.text}</td>
                                    <td className='yellow'>{num}</td>
                                    <td className='yellow'>{Math.round(percent * 100)}%</td>
                                </tr>)
                            })
                        }
                    </tbody>
                </table>
            </div>
        )
    }
}
export default CustomerTable;